﻿<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <title></title>
    
   <link rel="stylesheet" type="text/css" href="http://localhost:8080/testA/arcgisjs/js/dojo/dijit/themes/tundra/tundra.css" />
    <script type="text/javascript" src="http://localhost:8080/testA/arcgisjs/init.js"></script>
    <script type="text/javascript" src="http://localhost:8080/testA/arcgisjs/jsapi_vsdoc12_v38.js"></script>
    <link rel="stylesheet" type="text/css" href="http://localhost:8080/testA/arcgisjs/js/esri/css/esri.css" />
    <style>
      html, body, #map {
        height: 100%; width: 100%; margin: 0; padding: 0; 
      }
    </style>

    <script>
        var map;

        require([
          "esri/map",
          "esri/geometry/Extent",
          "esri/layers/FeatureLayer",

          "esri/symbols/SimpleLineSymbol",
          "esri/symbols/SimpleFillSymbol",
          "esri/symbols/TextSymbol",
          "esri/renderers/SimpleRenderer",

          "esri/layers/LabelLayer",

          "esri/Color",
          "dojo/domReady!"
        ], function (
          Map, Extent, FeatureLayer,
          SimpleLineSymbol, SimpleFillSymbol, TextSymbol, SimpleRenderer,
          LabelLayer,
          Color
        ) {
        
            var bbox = new Extent({ "xmin": -1940058, "ymin": -814715, "xmax": 1683105, "ymax": 1446096, "spatialReference": { "wkid": 102003 } });
            map = new Map("map", {
                extent: bbox
            });

            var labelField = "STATE_NAME";

  
            var statesColor = new Color("#666");
            var statesLine = new SimpleLineSymbol("solid", statesColor, 1.5);
            var statesSymbol = new SimpleFillSymbol("solid", statesLine, null);
            var statesRenderer = new SimpleRenderer(statesSymbol);
            // create a feature layer to show country boundaries
            var statesUrl = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3";
            var states = new FeatureLayer(statesUrl, {
                id: "states",
                outFields: [labelField]
            });
            states.setRenderer(statesRenderer);
            map.addLayer(states);

            // create a text symbol to define the style of labels
            var statesLabel = new TextSymbol().setColor(statesColor);
            statesLabel.font.setSize("14pt");
            statesLabel.font.setFamily("arial");
            var statesLabelRenderer = new SimpleRenderer(statesLabel);
            var labels = new LabelLayer({ id: "labels" });//创建LabelLayer
            // 添加FeatureLayer，样式适配器，字段
            labels.addFeatureLayer(states, statesLabelRenderer, "${STATE_NAME}");
            // add the label layer to the map
            map.addLayer(labels);
        });
    </script>
  </head>
  <body>
    <div id="map"></div>
  </body>
</html>